// 引入App 组件
// 按Ctrl键，引入的是"module": "dist/vue.runtime.esm.js", 这个阉割版的vue.js，其中不包含 template 属性。
import Vue from 'vue';
// 引入一人之下，万人之上的 App.vue 组件
import App from './App.vue';

/**
 * 总结说明，关于不同版本的Vue:
 *
 * 1、vue.js 与 vue.runtime.xxx.js的区别：
 *  - (1)、vue.js是完整版的Vue，包含:核心功能+模板解析器。
 *  - (2)、vue.runtime.xxx.js是运行版的Vue，只包含：核心功能。没有板解析器。
 *
 * 2、因为vue.runtime.xxx.js没有模板解析器，所以不能使用template配置项，需要使用 render 函数接收到的 createElement 函数去指定具体内容。
 */

// 创建Vue实例对象：vm
new Vue({
    // 其中该行代码相当于是：.$mount('#app')
    // "el": App,
    // 功能描述：该行代码的功能是将App组件放入容器中。
    // render: h => h(App),

    // // 其中render 是一个函数，其中参数 createElement 是用来创建元素
    // render(createElement) {
    //     console.log('判断createElement 是一个函数：', typeof createElement === 'function');
    //     return createElement(App);
    // },

    // render函数式写法
    // render: function (createElement) {
    //     return createElement(App)
    // },

    // // 改造一：没有使用到 this，就可以使用箭头函数
    // render: (createElement) => {
    //     return createElement(App)
    // },

    // “单参省括号，单句省花括；对象加圆括，多句加花括；没有this和arguments，不能new它！”
    // 改造二：箭头函数只有一个参数，可以省略小括号。如果函数体只有一句且有return的话，省略{} 和 return
    // render: createElement => {
    //     return createElement(App)
    // },
    // render: createElement => createElement(App),

    // 改造三：将 createElement 简写成 h，如果 App 不加引号就是变量，如果加上引号就是参数，其中html 是没有App 标签的，就会报错。
    render: h => h(App),

}).$mount('#app')

// 其中.$mount('#app') 相当于是："el": "#app",
